﻿/*
* jQuery showLoading plugin v1.0
* 
* Copyright (c) 2009 Jim Keller
* Context - http://www.contextllc.com
* 
* Dual licensed under the MIT and GPL licenses.
*
*/
(function($) {
		jQuery.fn.showLoading = function (options) {
	
	    var indicatorID = "mask-loading";
	    var settings = {
	        'addClass': '',
	        'beforeShow': '',
	        'afterShow': '',
	        'hPos': 'center',
	        'vPos': 'center',
	        'indicatorZIndex': 5000001,
	        'overlayZIndex': 5000000,
	        'parent': '',
	        'marginTop': 0,
	        'marginLeft': 0,
	        'overlayWidth': null,
	        'overlayHeight': null,
	        'message': '页面正在加载中...'
	    };
	
	    jQuery.extend(settings, options);
	
	    var loadingDiv = jQuery('<div><div class="loading-indicator"></div></div>');
	    var loadingMsg = loadingDiv.children();
	    var overlayDiv = jQuery('<div></div>');
	
	    //
	    // Set up ID and classes
	    //
	    if (settings.indicatorID) {
	        indicatorID = settings.indicatorID;
	    }
	    else {
	        indicatorID = jQuery(this).attr('id');
	    }
	
	    jQuery(loadingDiv).attr('id', 'loading-indicator-' + indicatorID);
	
	
	    if (settings.addClass) {
	        jQuery(loadingDiv).addClass(settings.addClass);
	    }
	    else
	        jQuery(loadingDiv).addClass('loading-box');
	
	    //
	    // Create the overlay
	    //
	    jQuery(overlayDiv).css('display', 'none');
	
	    // Append to body, otherwise position() doesn't work on Webkit-based browsers
	    jQuery(document.body).append(overlayDiv);
	
	    //
	    // Set overlay classes
	    //
	    jQuery(overlayDiv).attr('id', 'loading-indicator-' + indicatorID + '-overlay');
	
	    jQuery(overlayDiv).addClass('loading-indicator-overlay');
	
	    if (settings.addClass) {
	        jQuery(overlayDiv).addClass(settings.addClass + '-overlay');
	    }
	
	    //
	    // Set overlay position
	    //
	
	    var overlay_width;
	    var overlay_height;
	
	    var border_top_width = jQuery(this).css('border-top-width');
	    var border_left_width = jQuery(this).css('border-left-width');
	
	    //
	    // IE will return values like 'medium' as the default border, 
	    // but we need a number
	    //
	    border_top_width = isNaN(parseInt(border_top_width)) ? 0 : border_top_width;
	    border_left_width = isNaN(parseInt(border_left_width)) ? 0 : border_left_width;
	
	    var overlay_left_pos = jQuery(this).offset().left + parseInt(border_left_width);
	    var overlay_top_pos = jQuery(this).offset().top + parseInt(border_top_width);
	
	    if (settings.overlayWidth !== null) {
	        overlay_width = settings.overlayWidth;
	    }
	    else {
	        overlay_width = parseInt(jQuery(this).width()) + parseInt(jQuery(this).css('padding-right')) + parseInt(jQuery(this).css('padding-left'));
	    }
	
	
	    if (settings.overlayHeight !== null) {
	        overlay_height = settings.overlayHeight;
	    }
	    else {
	        overlay_height = parseInt(jQuery(this).height()) + parseInt(jQuery(this).css('padding-top')) + parseInt(jQuery(this).css('padding-bottom'));
	    }
	
	
	    jQuery(overlayDiv).css('width', overlay_width.toString() + 'px');
	    jQuery(overlayDiv).css('height', overlay_height.toString() + 'px');
	
	    jQuery(overlayDiv).css('left', overlay_left_pos.toString() + 'px');
	    jQuery(overlayDiv).css('position', 'absolute');
	
	    jQuery(overlayDiv).css('top', overlay_top_pos.toString() + 'px');
	    jQuery(overlayDiv).css('z-index', settings.overlayZIndex);
	
	    //
	    // Set any custom overlay CSS		
	    //
	    if (settings.overlayCSS) {
	        jQuery(overlayDiv).css(settings.overlayCSS);
	    }
	
	
	    //
	    // We have to append the element to the body first
	    // or .width() won't work in Webkit-based browsers (e.g. Chrome, Safari)
	    //
	    jQuery(loadingDiv).css('display', 'none');
	    loadingMsg.text(settings.message);
	    jQuery(document.body).append(loadingDiv);
	
	    jQuery(loadingDiv).css('position', 'absolute');
	    jQuery(loadingDiv).css('z-index', settings.indicatorZIndex);
	
	    //
	    // Set top margin
	    //
	
	    var indicatorTop = overlay_top_pos;
	
	    if (settings.marginTop) {
	        indicatorTop += parseInt(settings.marginTop);
	    }
	
	    var indicatorLeft = overlay_left_pos;
	
	    if (settings.marginLeft) {
	        indicatorLeft += parseInt(settings.marginTop);
	    }
	
	
	    //
	    // set horizontal position
	    //
	    if (settings.hPos.toString().toLowerCase() == 'center') {
	        jQuery(loadingDiv).css('left', (indicatorLeft + ((jQuery(overlayDiv).width() - parseInt(jQuery(loadingDiv).width())) / 2)).toString() + 'px');
	    }
	    else if (settings.hPos.toString().toLowerCase() == 'left') {
	        jQuery(loadingDiv).css('left', (indicatorLeft + parseInt(jQuery(overlayDiv).css('margin-left'))).toString() + 'px');
	    }
	    else if (settings.hPos.toString().toLowerCase() == 'right') {
	        jQuery(loadingDiv).css('left', (indicatorLeft + (jQuery(overlayDiv).width() - parseInt(jQuery(loadingDiv).width()))).toString() + 'px');
	    }
	    else {
	        jQuery(loadingDiv).css('left', (indicatorLeft + parseInt(settings.hPos)).toString() + 'px');
	    }
	
	    //
	    // set vertical position
	    //
	    if (settings.vPos.toString().toLowerCase() == 'center') {
	        jQuery(loadingDiv).css('top', (indicatorTop + ((jQuery(overlayDiv).height() - parseInt(jQuery(loadingDiv).height())) / 2)).toString() + 'px');
	    }
	    else if (settings.vPos.toString().toLowerCase() == 'top') {
	        jQuery(loadingDiv).css('top', indicatorTop.toString() + 'px');
	    }
	    else if (settings.vPos.toString().toLowerCase() == 'bottom') {
	        jQuery(loadingDiv).css('top', (indicatorTop + (jQuery(overlayDiv).height() - parseInt(jQuery(loadingDiv).height()))).toString() + 'px');
	    }
	    else {
	        jQuery(loadingDiv).css('top', (indicatorTop + parseInt(settings.vPos)).toString() + 'px');
	    }
	
	    //
	    // Set any custom css for loading indicator
	    //
	    if (settings.css) {
	        jQuery(loadingDiv).css(settings.css);
	    }
	
	
	    //
	    // Set up callback options
	    //
	    var callback_options =
				{
				    'overlay': overlayDiv,
				    'indicator': loadingDiv,
				    'element': this
				};
	
	    //
	    // beforeShow callback
	    //
	    if (typeof (settings.beforeShow) == 'function') {
	        settings.beforeShow(callback_options);
	    }
	
	    //
	    // Show the overlay
	    //
	    jQuery(overlayDiv).show();
	
	    //
	    // Show the loading indicator
	    //
	    jQuery(loadingDiv).show();
	
	    //
	    // afterShow callback
	    //
	    if (typeof (settings.afterShow) == 'function') {
	        settings.afterShow(callback_options);
	    }
	
	    return this;
	};
	
	jQuery.fn.hideLoading = function (options) {
	
	    var settings = {};
	
	    jQuery.extend(settings, options);
	
	    if (settings.indicatorID) {
	        indicatorID = settings.indicatorID;
	    }
	    else {
	        indicatorID = jQuery(this).attr('id');
	    }
	
	    jQuery(document.body).find('#loading-indicator-' + indicatorID).remove();
	    jQuery(document.body).find('#loading-indicator-' + indicatorID + '-overlay').remove();
	
	    return $(this);
	};
	
	$.showLoading = function (options) {
	    var defaults = { overlayHeight: getsize().height };
	    $.extend(defaults, options);
	    $("body").showLoading(defaults);
	};
	
	$.hideLoading = function () { $('body').hideLoading(); };
	
	function getsize() {
	    var windowHeight = 0;
	    var widowWidth = 0;
	    if (typeof (window.innerHeight) == 'number') {
	        windowHeight = window.innerHeight;
	        widowWidth = window.innerWidth;
	    }
	    else {
	        if (document.documentElement && document.documentElement.clientHeight) {
	            windowHeight = document.documentElement.clientHeight;
	            widowWidth = document.documentElement.clientWidth;
	        }
	        else {
	            if (document.body && document.body.clientHeight) {
	                windowHeight = document.body.clientHeight;
	                widowWidth = document.body.clientWidth;
	            }
	        }
	    }
	
	    return { width: widowWidth, height: windowHeight };
	}
})(jQuery);
